import React, { useCallback, useState } from "react";
import { Card, Flex, Button, Menu, Form, Checkbox, Input, App } from 'antd';
import { FormattedMessage, useIntl } from "react-intl";
import { withService } from "../../../../lib/AppView";
import { AdminRight, useAdminRight } from "@/pages/Admin/data/AdminPageAuth";

interface IWebsiteConfig {
    initData: any;
}

export const Website = withService<{}, IWebsiteConfig>({
    loadingOptions: {
        mode: "Skeleton",
        defaultVisible: true
    },
    reqEndPoints: [{
        endPoint: "setting.configWebsite",
        name: "initData"
    }]
})(({ withServiceApi, responseData }) => {
    const hasEditRight = useAdminRight("editable");
    const [ form ] = Form.useForm();
    const [ componentDisabled, setComponentDisabled ] = useState(!hasEditRight);
    const [ defaultFormData ] = useState(() => responseData.initData.data || {}); 
    const { message } = App.useApp();
    const intl = useIntl();
    const onSubmit = useCallback(() => {
        setComponentDisabled(true);
        withServiceApi.send({
            endPoint: "setting.updateWebsite",
            data: form.getFieldsValue()
        }).then((resp: any) => {
            setComponentDisabled(false);
            message.success(intl.formatMessage({
                id: "admin.pages.form.submit.success",
                defaultMessage: "数据提交成功！"
            }));
        }).catch((err: any)=>{
            message.error(err.message);
            setComponentDisabled(false);
        });
    }, []);
    return (
        <section>
            <Form
                labelCol={{ span: 5 }}
                wrapperCol={{ span: 12 }}
                layout="horizontal"
                disabled={componentDisabled}
                form={form}
                initialValues={defaultFormData}
            >
                <Form.Item
                    label={<FormattedMessage id="admin.pages.settings.website.sitename"/>}
                    name="sitename"
                >
                    <Input type="text" />
                </Form.Item>
                <Form.Item
                    label={<FormattedMessage id="admin.pages.settings.website.description"/>}
                    name="description"
                >
                    <Input.TextArea maxLength={200}/>
                </Form.Item>
                <Form.Item
                    label={<FormattedMessage id="admin.pages.settings.website.keywords"/>}
                    name="keywords"
                >
                    <Input type="text" />
                </Form.Item>
                <Form.Item
                    label={<FormattedMessage id="admin.pages.settings.website.adminSite.name.full"/>}
                    name="adminSiteNameFull"
                >
                    <Input type="text" />
                </Form.Item>
                <Form.Item
                    label={<FormattedMessage id="admin.pages.settings.website.adminSite.name.abbr"/>}
                    name="adminSiteNameAbbr"
                >
                    <Input type="text" />
                </Form.Item>
                <Form.Item
                    label={<FormattedMessage id="admin.pages.settings.website.contactor"/>}
                    name="contactor"
                >
                    <Input type="text" />
                </Form.Item>
                <Form.Item
                    label={<FormattedMessage id="admin.pages.settings.website.contactor.email"/>}
                    name="email"
                >
                    <Input type="text" />
                </Form.Item>
                <Form.Item
                    label={<FormattedMessage id="admin.pages.settings.website.copyright"/>}
                    name="copyright"
                >
                    <Input type="text" />
                </Form.Item>
                <Form.Item wrapperCol={{ offset: 5, span: 16 }}>
                    <AdminRight authRight="editable" mode="disabled">
                        <Button loading={hasEditRight && componentDisabled} type="primary" htmlType="submit" onClick={onSubmit}>
                            <FormattedMessage id="admin.pages.form.submit" />
                        </Button>
                    </AdminRight>
                </Form.Item>
            </Form>
        </section>
    );
});